._FONT() {
	font-family: inherit;
	font-size: 1em;
	line-height: 1.2em;
}

.f-form {
	._FONT;
	padding: 0.001em;
	h2 {
		font-size: 1.4em;
		margin: 0.5em 0 0.5em 0.15em;
	}
	form {
		display: block;
		padding: 0;
	}
	fieldset {
		padding: 0.3em 0.5em 0 0.5em;
	}
}

.f-form-widget {
	padding-bottom: 0.5em;
	position: relative;
	input, textarea, select {
		._FONT;
	}
}

.f-form-label {
	margin-left: 0.3em;
	font-weight: bold;
}

.f-form-widget-button .f-form-label {
	display: none;
}

.f-form-widget-text, .f-form-widget-password {
	input, textarea {
		border: 1px solid #000;
		display: block;
		width: 100%;
	}
}

.f-form-widget-text textarea {
	resize: vertical;
}

.f-form-widget-radio .f-form-label,
.f-form-widget-radio-option {
	padding-bottom: 0.5em;
}

.f-form-widget-radio {
	.f-form-widget-radio-option label {
		margin-left: 0.5em;
	}
	input[type="radio"] {
		margin: 0 0 0 0.5em;		
	}
}

.f-form-widget-checkbox {
	.f-form-label {
		font-weight: normal;
		display: inline-block;
		margin-left: 0.5em;
	}
	.f-form-element-message {
		display: inline-block;
	}
	.f-form-element {
		display: inline-block;
		float: left;
		input[type="checkbox"] {
			margin: 0.1em 0 0 0.5em;		
			display: inline-block;
		}
	}
}

.f-form-info {
	position: absolute;
	top: 0.2em;
	right: 0.7em;
	color: blue;
	font-size: 0.8em;
}

.f-form-message,
.f-form-element-message {
	color: red;
	font-size: 0.8em;
	padding-left: 0.3em;	
}

.f-form-element-message {
	padding-left: 0.5em;	
}

.f-form-widget-size-tiny {
	input, textarea, select {
		width: 3em;
	}
}

.f-form-widget-size-small {
	input, textarea, select {
		width: 8em;
	}
}

.f-form-widget-size-medium {
	input, textarea, select {
		width: 22em;
	}
}

.f-form-widget-group {
	border: 1px solid #000;
	padding-bottom: 0;
	padding-top: 0.8em;
	margin-top: 1em;
	margin-bottom: 0.5em;
	& > .f-form-label {
		position: absolute;
		top: -0.6em;
		background: #FFF;
		padding: 0 0.5em;
		margin-left: 1em;
	}
}


